import { unref } from 'vue';
import { useWebSocket, UseWebSocketReturn } from '@vueuse/core';

let result: UseWebSocketReturn<any>;
const listeners = new Map();

/**
 * 开启 WebSocket 链接，全局只需执行一次
 * @param url
 */
export function connectWebSocket(url: string) {
    result = useWebSocket(url, {
        // 自动重连 (遇到错误最多重复连接10次)
        autoReconnect: {
            retries: 10,
            delay: 5000,
            onFailed() {
                alert('Failed to connect WebSocket after 10 retries');
            },
        },
        heartbeat: {
            message: 'ping',
            interval: 1000,
            // pongTimeout: 1000,
        },
    });
    console.log(result);

    if (result) {
        result.open = onOpen;
        result.close = onClose;

        const ws = unref(result.ws);
        console.log(ws);

        if (ws != null) {
            ws.onerror = onError;
            ws.onmessage = onMessage;
        }
    }
}

function onOpen() {
    console.log('[WebSocket] 连接成功');
}

// @ts-ignore
function onClose(e) {
    console.log('[WebSocket] 连接断开：', e);
}

// @ts-ignore
function onError(e) {
    console.log('[WebSocket] 连接发生错误: ', e);
}

function onMessage(e: MessageEvent) {
    console.info('[WebSocket] -----接收消息-------', e.data, listeners);
    try {
        // const data = JSON.parse(e.data);
        for (const callback of listeners.keys()) {
            try {
                callback(e.data);
            } catch (err) {
                console.error(err);
            }
        }
    } catch (err) {
        console.error('[WebSocket] data解析失败：', err);
    }
}

/**
 * 添加 WebSocket 消息监听
 * @param callback
 */
export function onWebSocket(callback: (data: object) => any) {
    if (!listeners.has(callback)) {
        if (typeof callback === 'function') {
            listeners.set(callback, null);
        } else {
            console.debug('[WebSocket] 添加 WebSocket 消息监听失败：传入的参数不是一个方法');
        }
    }
}

/**
 * 解除 WebSocket 消息监听
 *
 * @param callback
 */
export function offWebSocket(callback: (data: object) => any) {
    listeners.delete(callback);
}

export function useMyWebSocket() {
    return result;
}
